<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <div th:insert="/common/common.html"></div>
    <meta charset="UTF-8">
    <title>Title</title>
    <script>
        var setting = {
            check: {
                enable: true,
                autoCheckTrigger: true
            },
            async: {
                enable: true,
                dataType: "json",
                url: "/menu/getMenuZtree",
                autoParam: ["id", "name"]
            },
            view: {
                addHoverDom: function (treeId, treeNode) {
                    var aObj = $("#" + treeNode.tId + "_a");
                    if (treeNode.editNameFlag || $("#btnGroup" + treeNode.tId).length > 0) return;
                    var s = '<span id="btnGroup' + treeNode.tId + '">';
                    if (treeNode.level == 0) {
                        s += '<a class="btn btn-info dropdown-toggle btn-xs" style="margin-left:10px;padding-top:0px;" onclick="addNode(' + treeNode.id + ')" href="#" >添加</a>';
                    } else if (treeNode.level == 1) {
                        s += '<a class="btn btn-info dropdown-toggle btn-xs" style="margin-left:10px;padding-top:0px;"  onclick="editNode(' + treeNode.id + ')" href="#" title="修改权限信息">修改</a>';
                        if (treeNode.children == undefined) {
                            s += '<a class="btn btn-info dropdown-toggle btn-xs" style="margin-left:10px;padding-top:0px;" onclick="deleteNode(' + treeNode.id + ')" href="#" >删除</a>';
                        }
                        s += '<a class="btn btn-info dropdown-toggle btn-xs" style="margin-left:10px;padding-top:0px;" onclick="addNode(' + treeNode.id + ')" href="#" >添加</a>';
                    } else if (treeNode.level == 2) {
                        s += '<a class="btn btn-info dropdown-toggle btn-xs" style="margin-left:10px;padding-top:0px;"  onclick="editNode(' + treeNode.id + ')" href="#" title="修改权限信息">修改</a>';
                        s += '<a class="btn btn-info dropdown-toggle btn-xs" style="margin-left:10px;padding-top:0px;" onclick="deleteNode(' + treeNode.id + ')" href="#">删除</a>';
                    }
                    s += '</span>';
                    aObj.after(s);
                },
                removeHoverDom: function (treeId, treeNode) {
                    $("#btnGroup" + treeNode.tId).remove();
                }
            }
        };
        function addNode(id){
            BootstrapDialog.show({
                title: '增加',
                message: $('<div></div>').load('/menu/toAdd'),
                closable: true,
                size: BootstrapDialog.SIZE_WIDE,
                buttons: [{
                    label: '取消',
                    action: function (dialog) {
                        dialog.close();
                    }
                }, {
                    label: '确定',
                    action: function (dialog) {
                        $.ajax({
                            url: "/menu/addInfo", // 请求地址
                            type: "post", // 请求方式
                            dataType: "json", // 后台返回的数据 以什么格式进行解析 json text xml  html
                            data: {"text": $("#menuName").val(), "url": $("#menuUrl").val(), "parentid": id,"button" : $("[name=button]").val(),"perms": $("#menuPerms").val()},
                            success: function (result) {// 成功回调函数
                                toastr.success("增加成功");
                                $.fn.zTree.init($("#treeDemo"), setting);
                                dialog.close();
                            },
                            error: function (result) {
                                toastr.error("网络异常")
                            }
                        })
                    }
                }]
            });
        }
        function deleteNode(id){
            if (confirm("确认删除吗")){
                $.ajax({
                    url: "/menu/deleteById?id=" + id, // 请求地址
                    type: "post", // 请求方式
                    dataType: "json", // 后台返回的数据 以什么格式进行解析 json text xml  html
                    data: $("#form").serialize(),
                    success: function (result) {// 成功回调函数
                        toastr.success("删除成功");
                        $.fn.zTree.init($("#treeDemo"), setting);
                    },
                    error: function (result) {
                        toastr.error("网络异常")
                    }
                })
            }
        }
        function editNode(id) {
            BootstrapDialog.show({
                title: '修改',
                message: $('<div></div>').load('/menu/toUpdate?id='+id),
                closable: true,
                size: BootstrapDialog.SIZE_WIDE,
                buttons: [{
                    label: '取消',
                    action: function (dialog) {
                        dialog.close();
                    }
                }, {
                    label: '确定',
                    action: function (dialog) {
                        $.ajax({
                            url: "/menu/updateMenuInfo", // 请求地址
                            type: "post", // 请求方式
                            dataType: "json", // 后台返回的数据 以什么格式进行解析 json text xml  html
                            data: $("#form").serialize(),
                            success: function (result) {// 成功回调函数
                                toastr.success("修改成功");
                                $.fn.zTree.init($("#treeDemo"), setting);
                                dialog.close();
                            },
                            error: function (result) {
                                toastr.error("网络异常")
                            }
                        })
                    }
                }]
            });
        }
        $(document).ready(function () {
            $.fn.zTree.init($("#treeDemo"), setting);
        });
    </script>
</head>
<body>
<div class="zTreeDemoBackground left">
    <ul id="treeDemo" class="ztree"></ul>
</div>
</body>
</html>